<template>
	<view>
		<view class="topbar">
			<view class="address">推荐</view>
			<view class="search">
				<u-search placeholder="日照香炉生紫烟"  :clearabled="true"></u-search>
			</view>
		</view>
		<view class="circle_item" v-for="(item,idex) in 10" :key="item.id">
			<view class="profile"></view>
			<view class="infomation">
				<view class="name">站长</view>
				<view class="time">2021-5-6</view>
				<view class="circle_item_content">
					瓶身描绘的牡丹一如你初妆，冉冉檀香透过窗心事我了然，宣纸上走笔至此搁一半
				</view>
			</view>
			
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss" scoped>
	.topbar{
		display: flex;
		flex-direction: row;
		height: 51px;
		background-color: #3399FF;
		.address{
			width: 60px;
			padding-top: 15px;
			padding-left: 30px;
		}
		.search{
			margin-left: 60rpx;
			padding-top: 10px;
			width: 480rpx;
		}
	}
	.circle_item{
		width: 314px;
		height: 170px;
		background-color: #366092;
		margin: 0 auto;
		margin-top: 15px;
		border-radius: 10px;
		display: flex;
		flex-direction: row;
		.profile{
			width: 50px;
			height: 50px;
			border: 1px solid black;
			border-radius: 50%;
			margin: 10px;
		}
		.infomation{
			width: 230px;
			.name{
				margin-top: 10px;
			}
			.time{
				margin-top: 5px;
			}
			.content{
				margin-top: 10px;
			}
		}
		
	}
</style>
